<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    [#include "/includes/header.html" /]
    <link rel="stylesheet" type="text/css"
          href="${webctx}/resources/js/jquery/themes/ui-lightness/jquery-ui-1.10.3.custom.css"/>
    <link rel="stylesheet" type="text/css" href="${webctx}/resources/css/fbuilder.css"></link>
</head>
<body class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden">
[#include "/includes/menus.html" /]
<div class="wrapper wrapper-content">
    <div class="row content-tabs">
        <nav class="page-tabs J_menuTabs">
            <div class="page-tabs-content" style="margin-left: 0px;">
                <a href="${webctx}/order" class="J_menuTab active">我的订单</a>
                <!-- <a href="${webctx}/order/sendaddr" class="J_menuTab">发货信息设置</a> -->
            </div>
        </nav>
    </div>
    <div class="row panel-body">
        <div style="padding-left: 20px;">
            <button id="mySendProductBtn" class="btn btn-primary btn-xs">批量发货</button>
        </div>
    </div>

    <div class="row ibox-content">
        <table width="100%" border="0" cellspacing="1" cellpadding="0"
               class="table table-striped table-bordered bootstrap-datatable datatable">
            <tr>
                <td colspan="3" style="text-align: left;">&nbsp;&nbsp;
                    <input type="text" id="start_date" name="start_date" style="width: 120px; cursor: pointer;"
                           onfocus="WdatePicker({isShowClear:false,readOnly:true,dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'end_date\')}'})"
                           class="Wdate" value=""/>
                    &nbsp;&nbsp;至&nbsp;&nbsp;
                    <input type="text" id="end_date" name="end_date" style="width: 120px; cursor: pointer;"
                           onfocus="WdatePicker({isShowClear:false,readOnly:true,dateFmt:'yyyy-MM-dd',mixDate:'#F{$dp.$D(\'start_date\');}'})"
                           class="Wdate" value=""/>

                    <a class="label label-default" href="javascript:dateTagBf(-7);">一周前</a>
                    <a class="label label-default" href="javascript:dateTagBf(-30);">一个月前</a>
                    <a class="label label-default" href="javascript:dateTagBf(-90);">三个月前</a>

                    &nbsp;&nbsp;&nbsp;
                    <select id="order_status_sel">
                        <option value="p_unpaid">等待买家付款</option>
                        <option value="p_paid" selected="selected">买家已付款</option>
                        <option value="s_shipped">卖家已发货</option>
                        <option value="p_refunded">卖家已退款</option>
                        <option value="o_completed">交易已成功</option>
                        <option value="">全部订单</option>
                    </select> &nbsp;&nbsp;&nbsp; <a href="javascript:void(0)" id="mymoreCond">更多</a>
                    &nbsp;&nbsp;&nbsp;
                    <button id="myqueryBtn" class="btn btn-success">查询</button>
                </td>
            </tr>
        </table>

        <table id="moreCondition" class="table table-striped table-bordered" style="display: none;" class="t_c">
            <tr>
                <th>买家昵称</th>
                <td><input id="nick_name" type="text"/></td>
                <th>收货人</th>
                <td><input id="receiver_name" type="text"/></td>
                <th>收货人手机</th>
                <td><input id="receiver_phone" type="text"/></td>
                <!-- <td>
                    <select id="shipping_status_sel">
                        <option value="">全部</option>
                        <option value="unshipped">未发货</option>
                        <option value="shipped">已发货</option>
                    </select>
                </td> -->
                <!-- <td>
                    <select>
                        <option value="001">全部</option>
                        <option value="002" selected="selected">未打印</option>
                        <option value="003">已打印</option>
                    </select>
                </td> -->
            </tr>
        </table>

        <div id="printToolsbar" class="panel-body">
            <div id="pager" class="jqpager"></div>
            <span id="checkedLines" style="float: left;">您选择了<label
                    style="font-size:16px;color:#f00;font-weight:bold;margin:0 3px;">0</label>单</span>
        </div>
        <table id="mainTable" border="0" class="table table-striped table-bordered bootstrap-datatable datatable">
            <thead>
            <tr>
                <th><input type="checkbox" id="all" title="全选/反选" style="margin-right: 4px; vertical-align: middle;"/>
                </th>
                <th>商品</th>
                <th>金额（元）</th>
                <th>买家</th>
                <th>收件人</th>
                <th>收件地址</th>
                <th>下单时间</th>
                <th>订单状态</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody class="tradeLotGrid">
            </tbody>
        </table>
    </div>
</div>

<!-- html 模板文件 -->
<!-- 模板区域开始 -->
<script type="text/template" id="order_table_tr_tpl">
    <tr class="package">
        <td valign="middle">
            <input type="checkbox" class="commchk" id="checkbox_{orderId}"
                   style="margin-right: 4px; vertical-align: middle;"/>
        </td>
        <td>
            <table id="order_item_{orderId}"></table>
        </td>
        <td>{totalPrice} <br>邮费：{postFee}</td>
        <td>{buyerNick}</td>
        <td>{receiverName}<br>{receiverPhone}</td>
        <td>{receiverProvince}{receiverCity}{receiverCountry}<br>{receiverAddr}</td>
        <td>{orderCreated}</td>
        <td>{orderStatus}</td>
        <td>
            <!-- <a id="detail_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">详情</a> -->
            <a id="a_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">发货</a>
            <a id="t_{orderId}" href="javascript:void(0)" style="text-decoration: underline;">退款</a></td>
    </tr>
</script>
<script type="text/template" id="order_item_table_tr_tpl">
    <tr>
        <td><img src="{productImg}" style="margin: 2px" width="30" height="30" number="1"><br/>{productName}</td>
        <td>{price} X</td>
        <td>{quantity}</td>
        <td><span></span></td>
    </tr>
</script>
<!-- 模板区域结束 -->

[#include "/includes/footer.html" /]
<script type="text/javascript" src="${webctx}/resources/js/jquery/ui/jquery-ui-1.10.3.min.js"></script>
<script type="text/javascript" src="${webctx}/resources/js/LodopFuncs.js"></script>
<script type="text/javascript" src="${webctx}/resources/js/trade/trade.context.js"></script>
<script type="text/javascript" src="${webctx}/resources/js/trade/trade.core.js"></script>
<script type="text/javascript">
    //查询条件
    var startDate = "", endDate = "", nickName = "", receiverName = "", receiverPhone = "";
    $(document).ready(function () {
        //打印发货单
        $("#myInvoicePrintBtn").click(function () {
            if (TBatch.getCheckedCount() <= 0) {
                obz.info("请选择订单");
                return false;
            }
            obz.ajaxJson(obz.ctx + "/order/getInvPrintData", {ids: TBatch.getChecked()}, function (resp) {
                if (resp.code != 200) {
                    obz.error(resp.msg);
                    return false;
                }

                var result = resp.data;
                Trade.useInvtpl = result.invoiceTemplate;		//发货单模板
                Trade.printInvoice(result.printData);			//打印的数据
            });
        });
        //打印快递单
        $("#myExpressPrintBtn").click(function () {
            if (TBatch.getCheckedCount() <= 0) {
                obz.info("请选择订单");
                return false;
            }
            var exp = $('input[name="myuseexpress"]:checked').val();
            if (!exp) {
                obz.info("请选择快递模板");
                return false;
            }
            obz.ajaxJson(obz.ctx + "/order/getExpPrintData", {ids: TBatch.getChecked(), exp: exp}, function (resp) {
                if (resp.code != 200) {
                    obz.error(resp.msg);
                    return false;
                }

                var result = resp.data;
                Trade.useExptpl = result.expressTemplate;		//模板
                Trade.printExpress(result.printData);	//打印的数据
            });
        });
        $("#myuserexpressdiv a.exp_set").click(function () {
            obz.ajaxJson(obz.ctx + "/express/getUserTplByKey", {expKey: $(this).attr("exp_key")}, function (resp) {
                if (resp.code != 200) {
                    obz.error("获取模快递板数据失败");
                    return false;
                }
                Trade.useExptpl = resp.data;
                Trade.expTemplateSetting();
            });
            return false;
        });
        //删除已设置的快递模板
        $("#myuserexpressdiv a.exp_del").click(function () {
            var me = $(this);
            obz.showMessage("确定删除<font color='red'>[" + me.attr("exp_name") + "]</font>吗?", function () {
                var expKey = me.attr("exp_key");
                obz.ajaxJson(obz.ctx + "/express/delTemplate", {expKey: expKey}, function (resp) {
                    if (resp.code != 200) {
                        obz.error(resp.msg);
                        return false;
                    }
                    Trade.useExptpl = null;
                    me.parent().remove();
                });
                return false;
            });

        });
        $("#mymoreCond").click(function () {
            var me = $(this);
            var atype = me.html();
            if ("更多" == atype) {
                $("#moreCondition").show();
                me.html("收起");
            } else {
                $("#moreCondition").hide();
                me.html("更多");
            }
        });
        $(':checkbox[name=myuseexpress]').each(function () {
            $(this).click(function () {
                if ($(this).attr('checked')) {
                    $(':checkbox[name=myuseexpress]').removeAttr('checked');
                    $(this).attr('checked', 'checked');
                    var me = $(this);
                    var expkey = me.val();
                    $("#myuserexpressdiv label").each(function () {
                        var me = $(this);
                        me.removeClass("expressname");
                    });
                    me.next().addClass("expressname");
                }
            });
        });
        searchItems();
        $("#myqueryBtn").click(function () {
            //获取查询条件
            startDate = $("#start_date").val();
            endDate = $("#end_date").val();
            nickName = $("#nick_name").val();
            receiverName = $("#receiver_name").val();
            receiverPhone = $("#receiver_phone").val();
            searchItems();
        });
    });
    var pageClick = function (pageNo) {
        searchItems(pageNo);
    }
    var searchItems = function (currPage) {
        var params = {};
        //其他查询条件
        if (currPage) {
            params.page = currPage;
        }
        params.startDate = startDate;
        params.endDate = endDate;
        params.nickNmae = nickName;
        params.receiverName = receiverName;
        params.receiverPhone = receiverPhone;
        params.orderStatus = $("#order_status_sel").val();
        //params.shippingStatus = $("#shipping_status_sel").val();
        $("#mainTable").mask("加载中...");
        var url = obz.ctx + "/order/list";
        obz.ajaxJson(url, params, function (resp) {
            var result = resp.data;
            $(".tradeLotGrid").empty();
            if (currPage) {
                $("#pager").pager({
                    pagenumber: currPage,
                    recordcount: result.totalRow,
                    pagesize: result.pageSize,
                    recordtext: '共 {0} 页, {1} 条记录',
                    buttonClickCallback: pageClick
                });
            } else {
                $("#pager").pager({
                    recordcount: result.totalRow,
                    pagesize: result.pageSize,
                    recordtext: '共 {0} 页, {1} 条记录',
                    buttonClickCallback: pageClick
                });
            }

            for (var i = 0; i < result.list.length; i++) {
                var order = result.list[i];
                var trTradeHtml = obz.dataTemplate4obj($("#order_table_tr_tpl").html(), order);
                $(".tradeLotGrid").append(trTradeHtml);
                if (order.orderStatus == '已支付') {
                    $("#a_" + order.orderId).show();
                    $("#t_" + order.orderId).show();
                } else {
                    $("#a_" + order.orderId).hide();
                    $("#t_" + order.orderId).hide();
                }
                for (var k = 0; k < order.orderItems.length; k++) {
                    var orderItem = order.orderItems[k];
                    var trOrderHtml = obz.dataTemplate4obj($("#order_item_table_tr_tpl").html(), orderItem);
                    $("#order_item_" + order.orderId).append(trOrderHtml);
                }
            }

            //注册显示详情事件
            TBatch.checkCheckbox(function () {
                $("#checkedLines").html("您选择了<label style='font-size:16px;color:#f00;font-weight:bold;margin:0 3px;'>" + TBatch.getCheckedCount() + "</label>单").css({'margin-left': '20px'});
            });
            TBatch.initCheckboxClick(function () {
                $("#checkedLines").html("您选择了<label style='font-size:16px;color:#f00;font-weight:bold;margin:0 3px;'>" + TBatch.getCheckedCount() + "</label>单").css({'margin-left': '20px'});
            });
            TBatch.initOptEvent(TableOpt.init());
            $("#mainTable").unmask();
        });
    }

    //=============================表格操作事件开始=============================================
    var TableOpt = {
        /* detail : function(param){
            alert(param[1])
        }, */
        send: function (param) {
            var url = obz.ctx + "/order/sendgoodsList?orderIds=" + param[1];
            var dialog = BootstrapDialog.show({
                size: BootstrapDialog.SIZE_NORMAL,
                title: "商品发货",
                message: $('<div></div>').load(url)
            });
        },
        refund: function (param) {
            var url = obz.ctx + "/order/refund?orderIds=" + param[1];
            var dialog = BootstrapDialog.show({
                size: BootstrapDialog.SIZE_NORMAL,
                title: "商品退款",
                message: $('<div></div>').load(url)
            });
        },
        init: function () {
            var optArray = new Array();
            //optArray.push(this.detail);
            optArray.push(this.send);
            optArray.push(this.refund);
            return optArray;
        }
    }

    $("#mySendProductBtn").click(function () {
        if (TBatch.getCheckedCount() <= 0) {
            obz.info("请选择订单");
            return false;
        }
        var url = obz.ctx + "/order/sendMoreGoodsList?ids=" + TBatch.getChecked();
        var dialog = BootstrapDialog.show({
            size: BootstrapDialog.SIZE_WIDE,
            title: "商品批量发货",
            message: $('<div></div>').load(url),
            buttons: [{
                label: '关闭',
                action: function (dialogItself) {
                    dialogItself.close();
                }
            }]
        });
    });
    //=============================表格操作事件结束=============================================
</script>
<script>
    Template.init("#menu-order");
</script>
</body>
</html>